<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <title>Title</title>
    <link rel="stylesheet" href="/static/editormd/css/editormd.min.css"/>
    <script src="/static/js/jquery-3.1.1.min.js"></script>
    <script src="/static/js/editormd.min.js"></script>
    <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body ng-app="markdown" ng-controller="markdownCtrl">
<div id="layout">
    <div class="editormd" id="test-editormd">
        <textarea></textarea>
    </div>
    <br/>
    <input id="submit" type="button" name="submit" value="Submit" class="btn" style="margin-left: 5%;" ng-click="submit()"/>
    <button id="preview-btn" ng-click="preview()">Preview HTML (Press Shift + ESC cancel)</button>
</div>
<script>
    var testEditor;
    window.onload = function() {
        testEditor = editormd("test-editormd", {
            width: "90%",
            height: 740,
            path : '/static/editormd/lib/',
            theme : "dark",
            previewTheme : "dark",
            editorTheme : "pastel-on-dark",
            codeFold : true,
            //syncScrolling : false,
            saveHTMLToTextarea : true,    // 保存 HTML 到 Textarea
            searchReplace : true,
            //watch : false,                // 关闭实时预览
            htmlDecode : "style,script,iframe|on*",            // 开启 HTML 标签解析，为了安全性，默认不开启
            //toolbar  : false,             //关闭工具栏
            //previewCodeHighlight : false, // 关闭预览 HTML 的代码块高亮，默认开启
            emoji : true,
            taskList : true,
            tocm            : true,         // Using [TOCM]
            tex : true,                   // 开启科学公式TeX语言支持，默认关闭
            flowChart : true,             // 开启流程图支持，默认关闭
            sequenceDiagram : true,       // 开启时序/序列图支持，默认关闭,
            //dialogLockScreen : false,   // 设置弹出层对话框不锁屏，全局通用，默认为true
            //dialogShowMask : false,     // 设置弹出层对话框显示透明遮罩层，全局通用，默认为true
            //dialogDraggable : false,    // 设置弹出层对话框不可拖动，全局通用，默认为true
            //dialogMaskOpacity : 0.4,    // 设置透明遮罩层的透明度，全局通用，默认值为0.1
            //dialogMaskBgColor : "#000", // 设置透明遮罩层的背景颜色，全局通用，默认为#fff
            imageUpload : true,
            imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp"],
            imageUploadURL : "/uploadfile",
            onload : function() {
                console.log('onload', this);

                //this.fullscreen();
                //this.unwatch();
                //this.watch().fullscreen();
                //this.setMarkdown("#PHP");
                //this.width("100%");
                //this.height(480);
                //this.resize("100%", 640);
            }
        });
        var app = angular.module('markdown', []);
        app.controller('markdownCtrl', function($scope,$http) {
            var blog={
                title:"test",
                content:""
            }
            $scope.submit=function () {
                blog.content = document.getElementsByClassName("editormd-preview-container")[0].innerHTML;
                console.log(blog);
                $http.post('test',blog).success(function (data) {
                    console.log(data);
                })
            }
            $scope.preview=function () {
                testEditor.previewing();
            }
        })
    };
</script>
</body>
</html>